<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>商品列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/Application/iframe/assets/libs/layuiadmin/layui/css/layui.css"/>
    <link rel="stylesheet" href="/Application/iframe/assets/libs/layuiadmin/style/admin.css" media="all">
    <link rel="stylesheet" href="/Application/iframe/assets/libs/layuiadmin/style/mylay.css" media="all">
</head>
<body>
<style>

    /* 左树 */

    #organizationTreeBar {

        padding: 10px 15px;

        border: 1px solid #e6e6e6;

        background-color: #f2f2f2;

    }



    #organizationTree {

        border: 1px solid #e6e6e6;

        border-top: none;

        padding: 10px 5px;

        overflow: auto;

        height: -webkit-calc(100vh - 125px);

        height: -moz-calc(100vh - 125px);

        height: calc(100vh - 125px);

    }



    .layui-tree-entry .layui-tree-txt {

        padding: 0 5px;

        border: 1px transparent solid;

        text-decoration: none !important;

    }



    .layui-tree-entry.ew-tree-click .layui-tree-txt {

        background-color: #fff3e0;

        border: 1px #FFE6B0 solid;

    }



    /* 右表搜索表单 */

    #organizationUserTbSearchForm .layui-form-label {

        box-sizing: border-box !important;

        width: 90px !important;

    }



    #organizationUserTbSearchForm .layui-input-block {

        margin-left: 90px !important;

    }

</style>
<div class="layui-fluid">
    <div class="layui-card">
        <!--<div class="layui-col-md3">-->

        <!--<div class="layui-card">-->

        <!--<div class="layui-card-body" style="padding: 10px;">-->

        <!--&lt;!&ndash; 树工具栏 &ndash;&gt;-->

        <!--<div class="layui-form toolbar" id="organizationTreeBar">-->

        <!--商品分类-->

        <!--</div>-->

        <!--&lt;!&ndash; 左树 &ndash;&gt;-->

        <!--<div id="organizationTree"></div>-->

        <!--</div>-->

        <!--</div>-->

        <!--</div>-->
        <div class="layui-card-body">
            <div style="padding-bottom: 10px;">
                <button class="layui-btn layui-btn-danger btn-top" data-type="batchdel">批量删除</button>
                <button class="layui-btn btn-top" data-type="add">添加商品</button>
            </div>

            <table id="LAY-table" lay-filter="LAY-table"></table>
            <script type="text/html" id="pic">
                <img src="{{d.pic}}" title="点击放大" lay-event="show">
                <span style="display:none;" id="pic{{d.id}}"><img src="{{d.pic}}"></span>
            </script>
            <script type="text/html" id="show">
                {{#  if(d.shop_id == 1){ }}
                <span class="yes_span"><i class="layui-icon layui-icon-ok-circle"></i> 是</span>
                {{#  } else { }}
                <span class="no_span"><i class="layui-icon layui-icon-tips"></i> 否</span>
                {{#  } }}
            </script>
            <script type="text/html" id="table-webuser">
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
                <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="img"><i class="layui-icon layui-icon-edit"></i>图片管理</a>
            </script>
        </div>
    </div>
</div>
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="/Application/iframe/assets/libs/layuiadmin/layui/layui.js"></script>
<script>
    var url = '/admin/ads';
    layui.config({
        base: '/Application/iframe/assets/libs/layuiadmin/'
    }).extend({
        index: 'lib/index'
    }).use(['index', 'table', 'form'], function(){
        var $ = layui.$
            ,form = layui.form
            ,table = layui.table;

        //初始化列表
        table.render({
            elem: '#LAY-table'
            ,url: "{:U('Merchant/ShoppingMall/listsl')}" //接口
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field: 'id', width: 80, title: 'ID', sort: true}
                ,{field: 'title', width:140, title: '名称'}
                ,{field: 'old_price', width: 140, title: '价格'}
                ,{field: 'new_price', width: 140, title: '优惠价'}
                ,{field: 'postage', width:140, title: '邮费'}
                ,{field: 'inventory', width:140, title: '库存'}
                ,{title: '操作', width: 300, align:'center', fixed: 'right', toolbar: '#table-webuser'}
            ]]
            ,page: true
            ,limit: 20
            ,height: 'full-100'
            ,text: {none: '暂无相关数据'}
        });

        //监听编辑+单个删除
        table.on('tool(LAY-table)', function(obj){
            var data = obj.data;
            if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){
                    $.ajax({
                        type:"GET",
                        url:"{:U('Merchant/shoppingMall/del_shop')}",
                        data: {id:data.id},
                        dataType:"json",
                        beforeSend: function () {
                            layer.load(1);
                        },
                        success:function(res){
                            layer.closeAll();
                            if(res.code == 1001){
                                obj.del();
                            }
                            else {
                                layer.msg(res.msg);
                            }
                        }
                    });

                });
            } else if(obj.event === 'edit'){
                layer.open({
                    type: 2
                    ,title: '编辑商品'
                    ,content: "{:U('shoppingMall/save_shop')}"+"?id="+data.id
                    ,maxmin: true
                    ,area: ['60%', '60%']
                    ,btn: ['确定', '取消']
                    ,yes: function(index, layero){
                        var iframeWindow = window['layui-layer-iframe'+ index]
                            ,submitID = 'LAY-submit'
                            ,submit = layero.find('iframe').contents().find('#'+ submitID);

                        //监听提交
                        iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
                            var field = data.field; //获取提交的字段
                            var m_show = 0;
                            if (field.m_show != undefined){
                                m_show = field.m_show;
                            }
                            console.log(field)
                            $.ajax({
                                type:"post",
                                url:"{:U('shoppingMall/save_shop')}",
                                data: {
                                    id:field.id,
                                    title:field.title,
                                    thumb:field.thumb,
                                    class_id:field.class_id,
                                    shop_id:field.shop_id,
                                    spec_id:field.spec_id,
                                    content:field.content,
                                    new_price:field.new_price,
                                    old_price:field.old_price,
                                    postage:field.postage,
                                    inventory:field.inventory,
                                    a_class:field.a_class,
                                    seckill_id:field.seckill_id,
                                    sort:field.sort,
                                    m_pic:field.m_pic

                                },
                                dataType:"json",
                                beforeSend: function () {
                                    layer.load(1);
                                },
                                success:function(res){
                                    layer.close(layer.index);
                                    if(res.code == 1001){
                                        layer.closeAll();
                                        table.reload('LAY-table',{where: {time:new Date()}}); //数据刷新
                                    }
                                    else {
                                        layer.msg(res.msg);
                                    }
                                }
                            });

                        });

                        submit.trigger('click');
                    }
                });
            } else if(obj.event === 'show'){
                layer.open({
                    type: 1,
                    shade: false,
                    title: false,
                    content: $('#pic' + data.id)
                });
            }else if(obj.event === 'img'){

                layer.open({
                    type: 2
                    ,title: '缩略图管理'
                    ,content: "{:U('shoppingMall/shop_img')}"+"?id="+data.id
                    ,maxmin: true
                    ,area: ['60%', '60%']
                    ,btn: ['确定', '取消']
                    ,yes: function(index, layero){
                        var iframeWindow = window['layui-layer-iframe'+ index]
                            ,submitID = 'LAY-submit'
                            ,submit = layero.find('iframe').contents().find('#'+ submitID);



                        submit.trigger('click');
                    }
                });
            }

        });

        //批量删除+添加
        var active = {
            batchdel: function(){
                var checkStatus = table.checkStatus('LAY-table')
                    ,checkData = checkStatus.data //得到选中的数据
                    ,ids = "0";
                if(checkData.length === 0){
                    return layer.msg('请选择数据');
                }
                $.each(checkData,function(key,value){
                    ids = ids + "," + checkData[key]['id'];
                });
                layer.confirm('确定删除吗？', function(index) {
                    $.ajax({
                        type:"post",
                        url:"{:U('Merchant/shoppingMall/del_shop')}",
                        data: {id:ids},
                        dataType:"json",
                        beforeSend: function () {
                            layer.load(1);
                        },
                        success:function(res){
                            layer.closeAll();
                            if(res.code == 1001){
                                table.reload('LAY-table',{where: {time:new Date()}});
                                layer.msg('已删除');
                            }
                            else {
                                layer.msg(res.msg);
                            }
                        }
                    });
                });
            }
            ,add: function(){
                layer.open({
                    type: 2
                    ,title: '添加商品'
                    ,content: "{:U('Merchant/shoppingMall/add_shop')}"
                    ,maxmin: true
                    ,area: ['60%', '60%']
                    ,btn: ['确定', '取消']
                    ,yes: function(index, layero){
                        var iframeWindow = window['layui-layer-iframe'+ index]
                            ,submitID = 'LAY-submit'
                            ,submit = layero.find('iframe').contents().find('#'+ submitID);
                        //监听提交
                        iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
                            var field = data.field; //获取提交的字段
                            var m_show = 0;
                            if (field.m_show != undefined){
                                m_show = field.m_show;
                            }
                            console.log(field);

                            //提交 Ajax 成功后，静态更新表格中的数据
                            $.ajax({
                                type:"post",
                                url:"{:U('Merchant/shoppingMall/add_shop')}",
                                data: {
                                    title:field.title,
                                    thumb:field.thumb,
                                    class_id:field.class_id,
                                    spec_id:field.spec_id,
                                    content:field.content,
                                    new_price:field.new_price,
                                    old_price:field.old_price,
                                    postage:field.postage,
                                    inventory:field.inventory,
                                    a_class:field.a_class,
                                    seckill_id:field.seckill_id,
                                    sort:field.sort,
                                    m_pic:field.m_pic


                                },
                                dataType:"json",
                                beforeSend: function () {
                                    layer.load(1);
                                },
                                success:function(res){
                                    layer.close(layer.index);
                                    if(res.code == 1001){
                                        layer.closeAll();
                                        table.reload('LAY-table',{where: {time:new Date()}}); //数据刷新
                                    }
                                    else {
                                        layer.msg(res.msg);
                                    }
                                }
                            });
                        });
                        submit.trigger('click');
                    }
                });
            }
        };

        $('.layui-btn.btn-top').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        var arr = new Array();
        $(".layui-form-checked").click(function(){
            alert('s');
            $("input:checkbox[name='spec_id[]']:checked").each(function(i){
                arr[i] = $(this).val();
            });
            var arrData = arr.join(",");
            $("#a").val(arrData)
            console.log();
        })
    });
</script>
</body>
</html>